<template>
	<view>
		<view class="cn">
			<view style="display: flex;align-items: center;">
				<uni-icons type="contact" size="55"></uni-icons>
				<view id="ms">
					<view>产品名称：{{product.productName}}</view>
					<view>产品介绍：{{product.productIntroduce}}</view>
					<view>使用场景：{{product.scene}}</view>
				</view>
			</view>
			<view id="btn">
				<uni-tag @click="toTem()" text="示例报告" type="primary" style="margin: 20rpx;" />
				<uni-tag @click="$tab.navigateTo('/pages/home/invite?id=' + productId)" text="立即推广" type="success" />
			</view>
		</view>

		<view class="team">
			<view>
				<h2>{{ zeroTwo(product.pricing) }}</h2>
				<text>当前我的售价</text>
			</view>
			<view>
				<h2>{{zeroTwo(product.brokerage)}}</h2>
				<text>我的佣金(收入)</text>
			</view>
			<view>
				<h2>{{zeroTwo(product.floorPrice)}}</h2>
				<text>底价({{level}}级)</text>
			</view>
		</view>

		<view id="sjyj">
			<uni-forms ref="form" :modelValue="from" :rules="rules" validate-trigger="bind" label-align="right"
				label-width="200rpx">
				<view id="sj">
					<picker style="margin: 0 auto;" ref="mp" @change="bpc" :value="index" :range="array">
						<view>{{array[index]}}</view>
					</picker>
					<button type="primary" size="mini" @click="$refs.mp.$el.click()">选择售价佣金</button>
				</view>
				<uni-forms-item style="margin: 10px auto" label="对下级提成" required
					v-if='$auth.hasRoleOr(["admin", "common"])'>
					<uni-easyinput type="number" v-model="from.royalty" placeholder="请输入提成">
						<template #right>
							<button style="margin-right: 6rpx" type="primary" size="mini"
								@click="updatePrice()">修改提成</button>
						</template>
					</uni-easyinput>
				</uni-forms-item>
			</uni-forms>

		</view>
		<view id='sm'>
			<view>佣金：您自己推广客户成功查询一单后您的收益</view>
			<view v-if='$auth.hasRoleOr(["admin", "common"])'>提成：您下级代理成功查询一单后您的提成收益</view>
		</view>
	</view>
</template>

<script>
	import {
		priceInfo,
		setPrice
	} from '@/api/index.js'

	import {
		getLevel,
		promoteEquity
	} from '@/api/system/equities.js'

	import {
		zeroTwo
	} from '@/utils/common.js'

	export default {
		name: 'Tuiguang',
		props: {
			productId: {
				required: true,
				type: String
			}
		},
		data() {
			return {
				product: {
					productName: undefined,
					productIntroduce: undefined,
					scene: undefined,

					pricing: undefined,
					brokerage: undefined,
					floorPrice: undefined
				},
				royalty: undefined,
				maxRoyalty: undefined,
				maxBrokerage: undefined,
				level: undefined,

				from: {
					royalty: undefined
				},

				array: [],
				brokerageArray: [],
				index: 0,
				
				rules: {
					royalty: {
						rules: [{
								required: true,
								errorMessage: '请填写提成'
							},
							{
								format: 'number',
								errorMessage: '必须是数字'
							},
							{
								minimum: 0,
								errorMessage: '提成需大于等于{minimum}'
							}
						]
					}
				}
			}
		},
		mounted() {
			getLevel().then(res => {
				this.level = res.msg
			})
			this.getInfo()
		},
		methods: {
			zeroTwo,
			getInfo() {
				const sjxx = priceInfo({
					productId: this.productId,
					userId: this.$store.state.user.userid
				})
				const xzxx = promoteEquity({
					productId: this.productId
				})
				Promise.all([sjxx, xzxx]).then(result => {
					this.product = result[0].data

					const item = result[1].data[0]
					uni.setNavigationBarTitle({
						title: item.productName
					})
					this.royalty = item.royalty
					this.maxRoyalty = item.maxRoyalty
					this.maxBrokerage = item.maxBrokerage
					this.from.royalty = zeroTwo(item.royalty)
					
					this.makeArray(this.product)
				})
			},

			makeArray(product) {
				var fp = product.keepFloorPrice
				var zj = fp + this.maxBrokerage
				for (var i = fp; i <= 30; i++) {
					if (i > zj) {
						break
					}
					this.array.push(`若售价 ${zeroTwo(i)} 元，我的佣金 ${zeroTwo(i - fp)} 元`)
					this.brokerageArray.push(zeroTwo(i - fp))
				}
				let wz = 0
				for (var i = fp > 31 ? 1 + fp : 31; i <= 90; i++) {
					wz++
					if (i > zj) {
						break
					}
					this.array.push('若售价 ' + zeroTwo(i) + ' 元，我的佣金 ' + zeroTwo(i - fp - (i - 30) * 0.08) + ' 元')
					this.brokerageArray.push(zeroTwo(i - fp))
				}
				for (var i = fp > 91 ? 1 + fp : 91; i <= 120; i++) {
					wz++
					if (i > zj) {
						break
					}
					this.array.push('若售价 ' + zeroTwo(i) + ' 元，我的佣金 ' + zeroTwo(i - fp - (i - 30) * 0.09) + ' 元')
					this.brokerageArray.push(zeroTwo(i - fp))
				}
				for (var i = fp > 121 ? 1 + fp : 121; i <= 200; i++) {
					wz++
					if (i > zj) {
						break
					}
					this.array.push('若售价 ' + zeroTwo(i) + ' 元，我的佣金 ' + zeroTwo(i - fp - (i - 30) * 0.1) + ' 元')
					this.brokerageArray.push(zeroTwo(i - fp))
				}
			},
			bpc(e) {
				this.index = e.detail.value
				var data = {
					productId: this.productId,
					userId: this.$store.state.user.userid,
					brokerage: this.brokerageArray[this.index]
				}
				setPrice(data).then(res => {
					if (res.code == 200) {
						this.$modal.msgSuccess("修改成功！");
						this.getInfo()
					} else {
						this.$modal.msg(res.msg)
					}
				})
			},
			updatePrice() {
				this.$refs.form.validate().then(res => {
					var fr = Number.parseFloat(this.from.royalty)
					var V0P = this.product.v0Pricing
					if (this.royalty == fr) {
						return
					} else if (fr < 0 || V0P + fr > 30) {
						this.$modal.msgError(`提成在0与${30 - V0P}之间`)
						return
					} else if (fr > this.maxRoyalty) {
						this.$modal.msgError(`您的提成需小于${this.maxRoyalty}，提升请联系客服!`)
						return
					}
					setPrice({
						productId: this.productId,
						userId: this.$store.state.user.userid,
						royalty: fr
					}).then(res => {
						if (res.code == 200) {
							this.$modal.msgSuccess("修改成功")
							this.getInfo()
						} else {
							this.$modal.msgError(res.msg)
						}
					})
				}).catch(err => {
					console.log('表单错误信息：', err)
				})
			},
			toTem() {
				this.$tab.navigateTo('/pages/' + this.$path[this.productId])
			}
		}
	}
</script>

<style lang="scss">
	.cn {
		width: 98%;
		padding: 16rpx;
		margin: 8rpx auto;
		background-color: aliceblue;
		border-radius: 12rpx;

		#ms {
			line-height: 24px;
			width: 85%;

			view {
				font-size: 27rpx;
				margin-bottom: 6px;
			}
		}

		#btn {
			text-align: right;
			padding: 16rpx;
		}
	}

	.team {
		width: 98%;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		text-align: center;
		background-color: aliceblue;
		border-radius: 12rpx;
	}

	.team view {
		width: 30%;
		height: 150rpx;
		padding: 38rpx 0;
	}

	#sjyj {
		margin: 20rpx 40rpx;
		display: flex;
		justify-content: center;

		#sj {
			display: flex;
			align-items: center;
		}
	}

	#sm view {
		text-align: center;
		margin-bottom: 10px;
	}
</style>